import { SitesVO } from '@/api/communicateSettings/sites/types';
import { StationVO } from '@/api/communicateSettings/station/types';
import { GisEditorVO } from '@/api/dataCenter/gisEditor/types';
import { computeAlarmColor } from '@/utils/gis';

// 生成当前测点图标
export const computeStationIcon = (options: StationVO) => {
  let iconName = '';
  switch (options.stty) {
    case 'liuliang':
      iconName = 'liuliang';
      break;
    case '闸门':
      iconName = 'zhamen';
      break;
    default:
      iconName = 'liuliang';
  }
  return `
  <div class="bigemap-station-marker" id="station-stcd-${options.stcd}">
  <div class="bigemap-station-icon" style="border: 2px solid ${computeAlarmColor(options.alarmLevel)}">
  <svg style="top: 50%; left: 50%; transform: translate(-50%, -50%); width: 14px; height: 17px;
  fill: ${computeAlarmColor(options.alarmLevel)}" aria-hidden="true"><use xlink:href="#icon-station-${iconName}"></use></svg>
  </div>
  <div class="bigemap-station-label" style="border: 2px solid ${computeAlarmColor(options.alarmLevel)};
  color: ${computeAlarmColor(options.alarmLevel)}">${options.stnm}</div>
  </div>
  `;
};

// 生成当前测站图标
export const initSiteIcon = (options: SitesVO) => {
  return `
    <div class="bigemap-station-marker" id="site-sitesId-${options.sitesId}">
  <div class="bigemap-station-icon" style="border: 2px solid ${computeAlarmColor(options.alarmLevel)}">
  <svg style="top: 50%; left: 50%; transform: translate(-50%, -50%); width: 14px; height: 17px;
  fill: ${computeAlarmColor(options.alarmLevel)}" aria-hidden="true"><use xlink:href="#icon-site"></use></svg>
  </div>
  <div class="bigemap-station-label" style="border: 2px solid ${computeAlarmColor(options.alarmLevel)};
  color: ${computeAlarmColor(options.alarmLevel)}">${options.sitesName}</div>
  </div>
  `;
};

// 生成文本标注
export const computeOverlayLabel = (options: GisEditorVO) => {
  return `
    <div class="bigemap-overlay-label" style="border: 2px solid ${options.strokeColor}; color: ${options.strokeColor}">${options.label}</div>
  `;
};
